<!-- template inhertance -->
<extend name="layout/layui24"/>

<!-- styles -->
<block name="linkcss">

</block>

<!-- scripts -->
<block name="linkjs">

</block>

<!-- page title -->
<block name="webtitle">
    <title>客户详情</title>
</block>

<!-- navagations -->
<block name="breadcrumb">
    <ol class="breadcrumb breadcrumb-edit">
        <li><a href="customersIndex">客户信息</a></li>
        <li class="active">客户详情</li>
    </ol>
</block>

<!-- main body -->
<block name="content">
    <div class="mb-20">
        <!--标题信息-->
        <div class="header">
            <div style="font-size: 36px">
                {$customer.no}
                <span style="font-size: 60%; position: relative; top: -5px;">
                    <switch name="customer.status">
                        <case value="1">
                            <span class="tag tag-warning">待评审</span>
                        </case>
                        <case value="2">
                            <span class="tag tag-info">评审中</span>
                        </case>
                        <case value="3">
                            <span class="tag tag-success">已生效</span>
                        </case>
                        <default/>
                        <span class="tag tag-danger">已拒绝</span>
                    </switch>
                </span>
            </div>
            <div>
                <small class="text-muted">{$customer.create_user} 创建于 {$customer.create_time|date="Y年m月d日 H:i",###}</small>
            </div>
        </div>
        <!--按钮组-->
        <div class="toolbar mt-15">
            {//权限控制能否点击，生成的data-id代表该订单的id}
            <if condition="$customer">
                <button type="button" class="btn btn-default btn-sm" data-id="{$customer.id}" data-action="create">
                    <i class="icon-plus"></i>
                    创建评审
                </button>
                <else/>
                <button type="button" class="btn btn-default btn-sm" disabled>
                    <i class="icon-plus"></i>
                    创建评审
                </button>
            </if>

            <if condition="$customer">
                <div class="btn-group">
                    <buton type="button" class="btn btn-default btn-sm" data-id="{$customer.id}" data-action="edit">
                        <i class="icon-edit"></i>
                        编辑
                    </buton>
                    <buton type="button" class="btn btn-default btn-sm" data-id="{$customer.id}" data-action="del">
                        <i class="icon-trash"></i>
                        删除
                    </buton>
                </div>
                <else/>
                <div class="btn-group">
                    <buton type="button" class="btn btn-default btn-sm" disabled>
                        <i class="icon-edit"></i>
                        编辑
                    </buton>
                    <buton type="button" class="btn btn-default btn-sm" disabled>
                        <i class="icon-trash"></i>
                        删除
                    </buton>
                </div>
            </if>
        </div>
    </div>
    <!--tab-->
    <div class="layui-tab layui-tab-brief" lay-filter="tab">
        <ul class="layui-tab-title">
            <li lay-id="customer" class="layui-this">客户信息</li>
            <li lay-id="review">评审记录</li>
            <li lay-id="order">订单信息</li>
        </ul>
        <div class="layui-tab-content px-0">
            <!--客户信息-->
            <div class="layui-tab-item layui-show">
                <!--引入表单带值-->
                <include file="Forms/includes/customerForm"/>
            </div>
            <!--评审记录-->
            <div class="layui-tab-item">
                <table class="table table-bordered">
                    <colgroup>
                        <col width="120">
                        <col>
                    </colgroup>
                    <tbody>
                    <tr>
                        <td>评审编号</td>
                        <td>
                            <a href="">{$customer.id}</a>
                        </td>
                    </tr>
                    <tr>
                        <td>评审状态</td>
                        <td>
                            <switch name="customer.status">
                                <case value="1">
                                    <span class="tag tag-warning">待评审</span>
                                </case>
                                <case value="2">
                                    <span class="tag tag-info">评审中</span>
                                </case>
                                <case value="3">
                                    <span class="tag tag-success">已生效</span>
                                </case>
                                <default/>
                                <span class="tag tag-danger">已拒绝</span>
                            </switch>
                        </td>
                    </tr>
                    <tr>
                        <td>创建者</td>
                        <td>{$customer.create_user}</td>
                    </tr>
                    <tr>
                        <td>更新时间</td>
                        <td>
                            <notempty>
                                {$customer.create_time|date="Y-m-d H:i:s",###}
                            </notempty>
                        </td>
                    </tr>
                    <tr>
                        <td>发起时间</td>
                        <td>
                            <notempty>
                                {$customer.create_time|date="Y-m-d H:i:s",###}
                            </notempty>
                        </td>
                    </tr>
                    <tr>
                        <td>生效时间</td>
                        <td>
                            <notempty>
                                {$customer.create_time|date="Y-m-d H:i:s",###}
                            </notempty>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
            <!--订单信息-->
            <div class="layui-tab-item">
                <table class="table table-hover">
                    <thead>
                    <tr>
                        <th>订单号</th>
                        <th>评审状态</th>
                        <th>物流状态</th>
                        <th>客户名称</th>
                        <th>客户合同号</th>
                        <th>创建者</th>
                        <th>创建时间</th>
                    </tr>
                    </thead>
                    <tbody>
                    <volist name="qw" id="vo">
                        <tr>
                            <td>
                                <a href=""></a>
                            </td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                    </volist>
                    </tbody>
                </table>

                <!-- 分页 -->
                <ul class="pagination pagination-edit">{$page}</ul>
            </div>
        </div>
    </div>
</block>

<block name="scripts">
    <script>
        $(function () {
            layui.use(['element','layer'],function () {
                var element = layui.element;

                //获取hash来切换选项卡
                var layId = location.hash.replace(/^#tab=/,'');
                element.tabChange('tab',layId);

                //监听tab切换改变地址hash值
                element.on('tab(tab)',function () {
                    location.hash = 'tab=' + this.getAttribute('lay-id');
                });

                //按钮事件
                $(document).on('click', '.btn', function () {
                    var action = $(this).attr('data-action'),
                        id = $(this).attr('data-id');

                    var data = {action:action,id:id};

                    //创建评审
                    if (action === 'create') {
                        submit(data);
                        console.log(data);
                    }

                    //编辑
                    if (action === 'edit') {
                        submit(data);
                        console.log(data);
                    }

                    //删除
                    if (action === 'del') {
                        layer.confirm("确定要删除该客户信息吗？", {icon: 3}, function (index) {
                            submit(data);
                            console.log(data);

                            layer.close(index);
                        })
                    }
                });

                //异步
                function submit(data) {
                    $.post("", data, function (response) {
                        if (response.code) {
                            layer.msg(response.msg, {icon:2});
                        } else {
                            //do something
                        }
                    })
                }
            })
        })
    </script>
</block>